var capture_setting ={};

capture_setting.is_recording = false;
capture_setting.the_canvas = null;
capture_setting.btn  = null;

chrome.extension.onMessage.addListener(function(request,sender,sendResponse) {
	if(request.cmd == "refresh_progress"){
		//$(document.body).append("<div>"+"frames:"+request.prog+"</div>");
		$("#progress").remove();
		if(request.prog == -1)
			$(document.body).append("<div id=progress>"+"finished!"+"</div>");
		else
			$(document.body).append("<div id=progress>"+"frame:"+request.prog+"</div>");

	}
});


var is_recording = false;



function on_hover(e){
	console.log("hover me");

	if(this.id =="record_button")
		return;

	chrome.extension.sendMessage({"cmd":"status"},function(response){
						is_recording = response;
						if(is_recording)
								$(".record_button").each(function(){
															this.innerHTML = "stop";
														 });
						else
								$(".record_button").each(function(){
															this.innerHTML = "record";
														 });
					});

	if(this.getBoundingClientRect)
	{
		capture_setting.the_canvas = this;
		var box = this.getBoundingClientRect();

		//$(".toolbar_div").hide();


		
		if(capture_setting.btn == null){
			var scrollLeft = window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft;
			var scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;

			var abs_x = box.right+scrollLeft;
			var abs_y = box.top+scrollTop;
			
			capture_setting.btn = $("#toolbar")[0];

			$(".record_button").bind("click",function(){
			
				console.log("clicked");

				
				if(!is_recording)
				{
					console.log("clicked");
					this.innerHTML="stop";
					
					console.log("this"+capture_setting.the_canvas);

					//var pos = getElementAbsolutePos(capture_setting.the_canvas);
					var pos = getElementAbsolutePos(capture_setting.the_canvas);
					var msg={"cmd":"capture","url":window.location.href, "rect":[pos.x,pos.y,capture_setting.the_canvas.clientWidth,capture_setting.the_canvas.clientHeight]};
					
					chrome.extension.sendMessage(msg,function(){
						console.log("callback again");
					});
					console.log(msg);
					console.log("finished");
				}else{
					this.innerHTML="record";
					 chrome.extension.sendMessage({"cmd":"stop_capture"});
				}

				//$("#toolbar").hide();
						
			});

			
		}

	
		else
		{
			var scrollLeft = window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft;
			var scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;

			var abs_x = box.right+scrollLeft;
			var abs_y = box.top+scrollTop;

			
			 $("#toolbar").css({ "position": "absolute", "left": (abs_x-10)+"px", "top": abs_y+"px" ,"z-index":"500"});
			 $("#toolbar").fadeIn('slow',function(){});

		}
	}
}


/*$("div").bind("hover",on_hover);
$("div").mousemove(
	function(e){
		$("#toolbar").css({ "position": "absolute", "left": e.pageX+"px", "top": (e.pageY-10)+"px" ,"z-index":"500"});
	});
*/


function check_state(){
	chrome.extension.sendMessage({"cmd":"status"},function(response){
						is_recording = response;
						if(is_recording)
								$(".record_button").each(function(){
															this.innerHTML = "stop";
														 });
						else
								$(".record_button").each(function(){
															this.innerHTML = "record";
														 });
					});
}


$(document).ready(function() { 
	setInterval("check_state()",1000);

	var str = '<div class="toolbar_div" id="toolbar_c2v" style="position:absolute;left:0px;top:0px;z-index:2147483647"><a id="record_button" class="record_button" href="javascript:void(0)">record</a></div>';	
	$(document.body).append(str);


	$("#record_button").bind("click",function(){
				
					console.log("clicked");

					
					if(!is_recording)
					{
						console.log("clicked");
						this.innerHTML="stop";
						
						console.log("this"+capture_setting.the_canvas);

						//var pos = getElementAbsolutePos(capture_setting.the_canvas);
						var pos = getElementAbsolutePos(capture_setting.the_canvas);
						var msg={"cmd":"capture","url":window.location.href, "rect":[pos.x,pos.y,capture_setting.the_canvas.clientWidth,capture_setting.the_canvas.clientHeight]};
						
						chrome.extension.sendMessage(msg,function(){
							console.log("callback again");
						});
						console.log(msg);
						console.log("finished");
						is_recording = true;
					}else{
						this.innerHTML="record";
						 chrome.extension.sendMessage({"cmd":"stop_capture"});
						 is_recording = false;
					}

					//$("#toolbar").hide();
							
				});




prevElement = null;
document.addEventListener('mousemove',
    function(e){
        var elem = e.target || e.srcElement;
        if (prevElement!= null) {prevElement.classList.remove("mouseOn");}
        elem.classList.add("mouseOn");

	
		

		if(elem.tagName=="object" || elem.tagName=="embed" || elem.tagName=="OBJECT" || elem.tagName=="EMBED"  || elem.tagName=="CANVAS")
		{

		


			capture_setting.the_canvas = elem;
			var box = elem.getBoundingClientRect();

			var scrollLeft = window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft;
			var scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;

			var abs_x = box.right+scrollLeft;
			var abs_y = box.top+scrollTop;

			 $("#toolbar_c2v").css({ "position": "absolute", "left": (abs_x)+"px", "top": abs_y+"px" ,"z-index":"2147483647"});
			  $("#toolbar_c2v").show();
		}
		
        prevElement = elem;
    },true);

});